/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

import React from 'react';
import type { ProColumns } from '@ant-design/pro-table';
import type { QueryData } from './index.d';
import { Row, Col, Button } from 'antd';
import { isArray } from 'lodash';

const qjColumnsItem = (queryData: QueryData | undefined) => {
  const defColumns: ProColumns[] = [
    {
      title: '订单号',
      dataIndex: 'order_id',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '客户订单号',
      dataIndex: 'third_order_id',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '订单品牌',
      dataIndex: 'brand',
      width: 150,
      align: 'center',
      search: false,
      render: (_, record) => {
        const { brand } = record;
        const { brand: brands = {} } = queryData;
        return brands[brand];
      },
    },
    {
      title: '订单状态',
      dataIndex: 'order_status_name',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '订单备注',
      dataIndex: 'package_note',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '订单取消原因',
      dataIndex: 'cancel_reason',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '下单时间',
      dataIndex: 'create_at',
      width: 150,
      align: 'center',
      search: false,
    },
    // {
    //   title: '接单网点',
    //   dataIndex: 'd_7',
    //   width: 150,
    //   align: 'center',
    //   search: false,
    // },
    {
      title: '接单时间',
      dataIndex: 'collect_date',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '接单快递员',
      dataIndex: 'collect_courier_name',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '快递员手机号',
      dataIndex: 'collect_courier_mobile',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '运单号',
      dataIndex: 'waybill_no',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '揽件时间',
      dataIndex: 'receive_time',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '揽件业务员',
      dataIndex: '', //无字段
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '揽件业务员电话',
      dataIndex: '', //无字段
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '用户ID',
      dataIndex: 'user_id',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '用户属性',
      dataIndex: 'user_type',
      width: 150,
      align: 'center',
      search: false,
      render: (_, redord) => {
        const { user_type } = redord;
        const userType = {
          user: '用户',
          regiment: '团长',
        };
        return userType[user_type];
      },
    },
    {
      title: '注册时间',
      dataIndex: 'register_time',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '所属团长',
      dataIndex: 'regiment_name',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '团长联系方式',
      dataIndex: 'regiment_mobile',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '寄件人信息',
      dataIndex: 'shipper_name',
      width: 150,
      align: 'center',
      search: false,
      renderText: function (value: string, d: any) {
        return (
          <div>
            <p>
              {value} {d.shipper_mobile}
            </p>
            <p>
              {d.shipper_province}-{d.shipper_city}-{d.shipper_county}-{d.shipper_address}
            </p>
          </div>
        );
      },
    },
    {
      title: '收件人信息',
      dataIndex: 'shipping_name',
      width: 150,
      align: 'center',
      search: false,
      renderText: function (value: string, d: any) {
        return (
          <div>
            <p>
              {value} {d.shipping_mobile}
            </p>
            <p>
              {d.shipping_province}-{d.shipping_city}-{d.shipping_county}-{d.shipping_address}
            </p>
          </div>
        );
      },
    },
    {
      title: '物品名称',
      dataIndex: 'package_info',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '产品类型',
      dataIndex: 'delivery_type_name',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '保价金额',
      dataIndex: 'real_warrant_price',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '物品重量',
      dataIndex: 'package_weight',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '付款类型',
      dataIndex: 'pay_method_name',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '结算重量',
      dataIndex: 'charging_weight',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '结算体积',
      dataIndex: 'settlement_volume',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '运费',
      dataIndex: 'freight',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '费用明细',
      dataIndex: 'settlement_price_details',
      width: 150,
      align: 'center',
      search: false,
      render: (_, record) => {
        const { settlement_price_details = [] } = record;
        if (settlement_price_details) {
          const details = JSON.parse(settlement_price_details);
          return isArray(details) && details.length > 0
            ? details.map((item: { name: string; fee: string }, index: number) => {
                return (
                  <div key={index}>
                    {item.name}: {item.fee}
                  </div>
                );
              })
            : '-';
        } else {
          return '-';
        }
      },
    },
    {
      title: '其他费用',
      dataIndex: 'other_money',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '结算状态',
      dataIndex: 'pay_status_name',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '结算时间',
      dataIndex: 'pay_date',
      width: 150,
      align: 'center',
      search: false,
    },
    // {
    //   title: '结算渠道',
    //   dataIndex: 'w_14',
    //   width: 150,
    //   align: 'center',
    //   search: false,
    // },
    {
      title: '支付商户号',
      dataIndex: 'order_number',
      width: 150,
      align: 'center',
      search: false,
    },
    {
      title: '交易流水号',
      dataIndex: 'trade_number',
      width: 150,
      align: 'center',
      search: false,
    },
  ];
  return defColumns;
};

function getTableToolbar({
  winSize,
  activity,
  handleMenuChange,
  setOpenedDownList,
  handleAddDownloadTask,
}: {
  winSize: string;
  activity: number;
  handleMenuChange: Function;
  isDownListOpened: boolean;
  setOpenedDownList: Function;
  handleAddDownloadTask: () => void;
}) {
  const isPhone = winSize && ['xs', 'sm'].includes(winSize);
  const toolbar = {
    title: '',
    menu: {
      items: [
        {
          key: '0',
          label: '订单信息',
        },
        {
          key: '1',
          label: '运单信息',
        },
        {
          key: '2',
          label: '收寄件信息',
        },
        {
          key: '3',
          label: '物品及支付信息',
        },
      ],
      type: 'tab',
      activeKey: activity + '',
      onChange: handleMenuChange,
    },
    actions: (
      <Row gutter={4} justify='space-between'>
        <Col span={10} style={{ marginBottom: 10 }} xs={winSize === 'xs' ? 24 : ''}>
          <Button
            type='primary'
            size={isPhone ? 'small' : 'middle'}
            onClick={() => setOpenedDownList(true)}
          >
            查看导出列表
          </Button>
        </Col>
        <Col span={10}>
          <Button
            onClick={handleAddDownloadTask}
            type='primary'
            size={isPhone ? 'small' : 'middle'}
          >
            添加导出任务
          </Button>
        </Col>
      </Row>
    ),
  };
  return toolbar;
}

export { qjColumnsItem, getTableToolbar };
